<template>
    <div  class="masker" v-show="noShow">
        <div class="add-modal">
           <div class="title"> 
                <span class="title-l">查看成员信息</span>
                <span class="title-f" @click="lookCancel">x</span>
            </div>
           <div class="view"> 
               <ul>
                    <li>ID</li>
                    <li>姓名</li>
                    <li>年龄</li>
                    <li>性别</li>
                    <li>爱好</li>
                    <li>电话</li>
                    <li>班级</li>
                </ul>
            </div>
           <div class="view">
                <ul>
                    <li v-for="(value,key) in lookItem" :key="key">{{value}}</li>
                </ul>
           </div>
        </div>
    </div>
</template>
<script>
export default {
    props:['lookItem','ViewShow'],
    data(){
        return {
            noShow : false,
        }
    },
    methods:{
        lookCancel(){
           this.$emit('ViewShowModal',this.onShow)
        }
    },
    watch:{
        // lookItem(){
        //     this.lookItems = JSON.stringify(this.lookItem)
        //     console.log(this.lookItems)
        // }
    }
}
</script>
<style scoped>
 .masker{
        position:fixed;
        top: 0;
        left: 0;
        bottom:0;
        right: 0;
        background: rgba(0, 0, 0, 0.5)
    }
    .add-modal{
        width: 600px;
        background: #fff;
        margin: 50px auto 0;
        height: 240px;
    }
    .add-modal .view{
    float: left;
    }
    .add-modal .view ul{
        width: 100px;
        /* height: 240px; */
    }
    .add-modal .view ul:nth-child(1){
        width: 80px;
        margin:10px 30px
    }
    .add-modal>div li{
        list-style: none
    }
    .delBtnAll{
        float: right;
        margin: 60px;
    }
</style>


